<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
    <%--<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>--%>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/js/bootstrap.min.js"></script>
    <%--<script src="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/js/bootstrap.bundle.min.js"></script>--%>
    <style>
        ::-webkit-scrollbar {
            display: none;
        }
    </style>
</head>
<body>
<div class="container mt-3">
    <br>
    <div class="card shadow">
        <div class="card-header">搜索</div>
        <div class="card-body">
            <div style="display: inline-block"><label for="select">&nbsp;&nbsp;字段:</label></div>
            <div style="display: inline-block">
                <select class="form-select" id="select" style="box-shadow:none">
                    <option>编号</option>
                    <option>部门</option>
                    <option>负责人</option>
                </select>
            </div>
            <div style="display: inline-block"><label style="white-space:nowrap" for="key">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;值:</label></div>
            <div style="display: inline-block"><input style="white-space:nowrap;box-shadow: none" type="text" class="form-control" id="key" name="value"></div>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <button id="search" type="button" class="btn btn-outline-success" style="box-shadow:none"><i class="fa fa-search" style="font-size:18px"></i>&nbsp;搜索</button>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <button type="button" id="add-worker" style="box-shadow:none" class="btn btn-outline-secondary" data-bs-toggle="modal" data-bs-target="#myModal-add">添加部门</button>

        </div>
    </div>
</div>
<div class="container mt-3">
    <table id="table" class="table table-hover" style="text-align: center">
        <thead>
        <tr>
            <th style="width: 81px">编号(ID)</th>
            <th style="width: 83px">部门</th>
            <th style="width: 66px">负责人</th>
            <th style="width: 94px">电话</th>
            <th style="width: 232px">邮箱</th>
            <th style="width: 141px">操作</th>
        </tr>
        </thead>
        <tbody id="tbody">
            <c:forEach items="${depts}" var="dept">
                <tr name="tr">
                    <input type="hidden" class="save_id" value="${dept.id}">
                    <td style="display:table-cell; vertical-align:middle">${dept.id}</td>
                    <td style="display:table-cell; vertical-align:middle">${dept.name}</td>
                    <td style="display:table-cell; vertical-align:middle">${dept.boss}</td>
                    <td style="display:table-cell; vertical-align:middle">${dept.phone}</td>
                    <td style="display:table-cell; vertical-align:middle">${dept.email}</td>
                    <td style="display:table-cell; vertical-align:middle">
                        <button url="{'id':'${dept.id}','name':'${dept.name}','boss':'${dept.boss}','phone':'${dept.phone}','email':'${dept.email}'}" name="update" type="button" class="btn btn-outline-primary" data-bs-toggle="modal" data-bs-target="#myModal-update" style="box-shadow:none">编辑</button>
                        <button url="http://localhost:8080/web/dept/delete?id=${dept.id}" name="delete" type="button" class="btn btn-outline-danger" data-bs-toggle="modal" data-bs-target="#myModal-delete" style="box-shadow:none">删除</button>
                    </td>
                </tr>
            </c:forEach>
        </tbody>
    </table>
</div>

<%--添加部门信息*模态框*--%>
<div class="modal fade" id="myModal-add">
    <div class="modal-dialog" style="width: 900px">
        <div class="modal-content">

            <!-- 模态框头部 -->
            <div class="modal-header">
                <h4 class="modal-title">添加部门信息</h4>
                <button id="add-btn" style="box-shadow:none" type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>

            <!-- 模态框内容 -->
            <div class="modal-body">
                <div class="container-fluid" style="height: 268px">
                    <form class="row g-3" action="" method="post">
                        <div class="col-md-1"></div>
                        <div class="col-md-5">
                            <div class="input-group mb-3">
                                <span class="input-group-text">部门编号</span>
                                <input type="text" class="form-control" id="dept-id" style="box-shadow: none">
                            </div>
                        </div>
                        <div class="col-md-6"></div>
                        <div class="col-md-1"></div>
                        <div class="col-md-5">
                            <div class="input-group mb-3">
                                <span class="input-group-text">部门名称</span>
                                <input type="text" class="form-control" id="add-name" style="font-size: 15px;box-shadow: none">
                            </div>
                        </div>
                        <div class="col-md-5">
                            <div class="input-group mb-3">
                                <span class="input-group-text">负责人</span>
                                <input type="text" class="form-control" id="add-people" style="box-shadow: none">
                            </div>
                        </div>
                        <div class="col-md-1"></div>
                        <div class="col-md-1"></div>
                        <div class="col-md-10">
                            <div class="input-group mb-3">
                                <span class="input-group-text">电&nbsp;话&nbsp;号&nbsp;</span>
                                <input type="text" class="form-control" id="add-phone" style="box-shadow: none">
                            </div>
                        </div>
                        <div class="col-md-1"></div>
                        <div class="col-md-1"></div>
                        <div class="col-md-10">
                            <div class="input-group mb-3">
                                <span class="input-group-text">&nbsp;&nbsp;邮&nbsp;&nbsp;箱&nbsp;&nbsp;</span>
                                <input type="text" class="form-control" id="add-email" style="box-shadow: none">
                            </div>
                        </div>
                    </form>
                </div>
            </div>

            <!-- 模态框底部 -->
            <div class="modal-footer">
                <button id="ok-add" type="button" style="box-shadow:none" class="btn btn-outline-primary">确定</button>
            </div>

        </div>
    </div>
</div>

<%--删除*模态框*--%>
<div class="modal fade" id="myModal-delete">
    <div class="modal-dialog" style="width: 450px;position: absolute;top: 26%;left: 35%">
        <div class="modal-content">
            <!-- 模态框头部 -->
            <div class="modal-header">
                <h5 class="modal-title">警告</h5>
                <button id="cancel-btn" style="box-shadow:none" type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <!-- 模态框内容 -->
            <div class="modal-body" style="text-align: center">
                数据删除后将无法恢复，您确定要删除吗？
            </div>
            <!-- 模态框底部 -->
            <div class="modal-footer">
                <input type="hidden" id="confirm-cancel">
                <button id="ok-delete" type="button" class="btn btn-outline-primary" style="box-shadow:none">确定</button>&nbsp;&nbsp;&nbsp;&nbsp;
                <button id="cancel-delete" type="button" class="btn btn-outline-primary" style="box-shadow:none">取消</button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            </div>
        </div>
    </div>
</div>

<%--编辑*模态框*--%>
<div class="modal fade" id="myModal-update">
    <div class="modal-dialog">
        <div class="modal-content">

            <!-- 模态框头部 -->
            <div class="modal-header">
                <h4 class="modal-title">编辑部门信息</h4>
                <button id="myupdate-down" style="box-shadow:none" type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>

            <div class="modal-body">
                <div class="container-fluid" style="height: 268px">
                    <form class="row g-3" action="" method="post">
                        <div class="col-md-1"></div>
                        <div class="col-md-5">
                            <div class="input-group mb-3">
                                <span class="input-group-text">部门编号</span>
                                <input type="text" class="form-control" id="id" style="background-color: white;box-shadow: none" readonly>
                            </div>
                        </div>
                        <div class="col-md-6"></div>
                        <div class="col-md-1"></div>
                        <div class="col-md-5">
                            <div class="input-group mb-3">
                                <span class="input-group-text">部门名称</span>
                                <input type="text" class="form-control" id="update-name" style="font-size: 15px;box-shadow: none">
                            </div>
                        </div>
                        <div class="col-md-5">
                            <div class="input-group mb-3">
                                <span class="input-group-text">负责人</span>
                                <input type="text" class="form-control" id="update-people" name="add-people" style="box-shadow: none">
                            </div>
                        </div>
                        <div class="col-md-1"></div>
                        <div class="col-md-1"></div>
                        <div class="col-md-10">
                            <div class="input-group mb-3">
                                <span class="input-group-text">电&nbsp;话&nbsp;号&nbsp;</span>
                                <input type="text" class="form-control" id="update-phone" name="add-phone" style="box-shadow: none">
                            </div>
                        </div>
                        <div class="col-md-1"></div>
                        <div class="col-md-1"></div>
                        <div class="col-md-10">
                            <div class="input-group mb-3">
                                <span class="input-group-text">&nbsp;&nbsp;邮&nbsp;&nbsp;箱&nbsp;&nbsp;</span>
                                <input type="text" class="form-control" id="update-email" name="add-email" style="box-shadow: none">
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <!-- 模态框底部 -->
            <div class="modal-footer">
                <button type="button" class="btn btn-outline-primary" style="box-shadow:none" id="position" data-bs-toggle="modal" data-bs-target="#position_modal">职位管理</button>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <button type="button" class="btn btn-outline-primary" style="box-shadow:none" id="ok-update">确定</button>
            </div>
        </div>
    </div>
</div>

<!-- 职位模态框 -->
<div class="modal fade" id="position_modal">
    <div class="modal-dialog" style="width: 550px">
        <div class="modal-content">
            <!-- 模态框头部 -->
            <div class="modal-header" style="text-align: center">
                <h4 class="modal-title" id="title">模态框标题</h4>
                <button type="button" class="btn-close" data-bs-dismiss="modal" style="box-shadow:none"></button>
            </div>
            <!-- 模态框内容 -->
            <div class="modal-body">
                <div id="accordion">
                    <div class="card" style="border: none">
                        <div class="card-body" style="text-align: center">
                            <table id="position_table_name" class="table table-bordered table-hover" style="text-align: center"></table>
                            <div style="display: inline-block"><input id="position_name" style="white-space:nowrap;box-shadow: none;width: 135px" type="text" class="form-control"></div>&nbsp;&nbsp;
                            <button type="button" id="position_add_position" class="btn btn-primary" style="box-shadow: none;background-color: #337ab7">添加</button>&nbsp;&nbsp;
                            <div style="display: inline-block">
                                <select class="form-select" id="position_select" style="box-shadow:none;width: 135px"></select>
                            </div>&nbsp;&nbsp;
                            <button type="button" id="position_delete_position" class="btn btn-danger" style="box-shadow: none;background-color: #d9534f">删除</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 职位——删除——模态框 -->
<div class="modal fade" id="position_delete_modal">
    <div class="modal-dialog">
        <div class="modal-content">
            <!-- 模态框头部 -->
            <div class="modal-header">
                <h5 class="modal-title">警告</h5>
                <button type="button" id="nb" class="btn-close" data-bs-dismiss="modal" style="box-shadow:none"></button>
            </div>
            <!-- 模态框内容 -->
            <div class="modal-body" style="text-align: center">
                职位删除后，将无法恢复，您确定要删除吗？
            </div>
            <!-- 模态框底部 -->
            <div class="modal-footer">
                <button id="position_ok_position" type="button" class="btn btn-outline-primary" style="box-shadow:none">确定</button>&nbsp;&nbsp;&nbsp;&nbsp;
                <button type="button" class="btn btn-outline-primary" data-bs-dismiss="modal" style="box-shadow:none">取消</button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            </div>
        </div>
    </div>
</div>


<%--信息提示框--%>
<div class="container mt-3" style="text-align: center;width: 360px;height: 20px;position: absolute;left: 570px;top: 18px;z-index: 1000000">
    <div class="alert alert-success" id="success" style="background-color: #dff0d8;display: none"></div>
    <div class="alert alert-info" id="warning" style="background-color: #d9edf7;display: none"></div>
    <div class="alert alert-danger" id="danger" style="background-color: #f2dede;display: none"></div>
</div>
<%--信息提示框--%>
<%--<div class="alert alert-success" id="success" style="text-align:center;width: 360px;position: absolute;left: 590px;top: 18px;display: none">
    <strong>成功!</strong>
</div>
<div class="alert alert-warning" id="warning" style="text-align:center;width: 300px;position: absolute;left: 600px;top: 34px;display: none;z-index: 2000">
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    <strong>警告!</strong>
</div>
<div class="alert alert-danger" id="danger" style="text-align:center;width: 300px;position: absolute;left: 600px;top: 14px;display: none;z-index: 2000">
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    <strong>次要的!</strong>
</div>--%>
</body>
<script>
    //检查id号是否存在
    function checkId(id){
        let flag=false
        $.ajax({
            url:"http://localhost:8080/web/dept/all",
            type:'get',
            async:false,
            data:{},
            dataType:'json',
            success:function (resp){
                for (let i = 0; i < resp.length; i++) {
                    if(id==resp[i].id){
                        flag=true
                    }
                }
            }
        })
        return flag
    }
    //检查员工是否存在
    function checkStaff(name){
        let flag=false
        $.ajax({
            url:"http://localhost:8080/web/staff/other",
            type:'get',
            async:false,
            data:{other:"person"},
            dataType:'json',
            success:function (resp){
                for (let i = 0; i < resp.length; i++) {
                    if(name==resp[i].name){
                        flag=true
                    }
                }
            }
        })
        return flag
    }
    //检查座机号码是否合法
    function checkPhone(phone){
        let regExp=/^\d{7,8}$/
        let ok=regExp.test(phone)
        return !ok
    }
    //检查邮箱是否合法
    function checkEmail(email){
        let regExp=/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/
        let ok=regExp.test(email)
        return !ok
    }
    //添加部门信息
    $('#ok-add').click(function (){
        if($('#dept-id').val()==""||$('#add-name').val()==""||$('#add-people').val()==""||$('#add-phone').val()==""||$('#add-email').val()==""){
            $('#warning').show()
            $('#warning').text("请完善信息")
            setTimeout(function (){
                $('#warning').fadeToggle("slow")
            },2000)
        }else if(checkId($('#dept-id').val())){
            $('#warning').show()
            $('#warning').text("部门编号已存在")
            setTimeout(function (){
                $('#warning').fadeToggle("slow")
            },2000)
        }else if(checkStaff($('#add-people').val())==false){
            $('#warning').show()
            $('#warning').text("系统中没有 '"+$('#add-people').val()+"' 该职工")
            setTimeout(function (){
                $('#warning').fadeToggle("slow")
            },2000)
        }else if(checkPhone($('#add-phone').val())){
            $('#warning').show()
            $('#warning').text("电话号码非法(由7~8位数字组成)")
            setTimeout(function (){
                $('#warning').fadeToggle("slow")
            },2000)
        }else if(checkEmail($('#add-email').val())){
            $('#warning').show()
            $('#warning').text("邮箱的格式非法")
            setTimeout(function (){
                $('#warning').fadeToggle("slow")
            },2000)
        }else{
            $.post("${pageContext.request.contextPath}/dept/add",
                {id:$('#dept-id').val(),name:$('#add-name').val(),boss:$('#add-people').val(),phone:$('#add-phone').val(),email:$('#add-email').val()},
                function (data){
                    if(data.length==1){
                        $('#warning').show()
                        $('#warning').text("系统中没有 '"+$('#add-people').val()+"' 该职工")
                        setTimeout(function (){
                            $('#warning').fadeToggle("slow")
                        },1200)
                    }else{
                        $('#add-btn').click()
                        $('#table').empty()
                        let newstyle="<thead>"+"<tr>"+
                            "<th style='width: 81px'>编号(ID)</th>"+
                            "<th style='width: 83px'>部门</th>"+
                            "<th style='width: 66px'>负责人</th>"+
                            "<th style='width: 94px'>电话</th>"+
                            "<th style='width: 232px'>邮箱</th>"+
                            "<th style='width: 141px'>操作</th>"+
                            "</tr>"+"</thead>"+"<tbody>"
                        for (let i = 0; i < data.length; i++) {
                            newstyle+="<tr name='tr'>"+
                                "<input type='hidden' class='save_id' value='"+data[i].id+"'>"+
                                "<td style='display:table-cell; vertical-align:middle'>"+data[i].id+"</td>"+
                                "<td style='display:table-cell; vertical-align:middle'>"+data[i].name+"</td>"+
                                "<td style='display:table-cell; vertical-align:middle'>"+data[i].boss+"</td>"+
                                "<td style='display:table-cell; vertical-align:middle'>"+data[i].phone+"</td>"+
                                "<td style='display:table-cell; vertical-align:middle'>"+data[i].email+"</td>"+
                                "<td style='display:table-cell; vertical-align:middle'>"+
                                "<button url=\"{'id':'"+data[i].id+"','name':'"+data[i].name+"','boss':'"+data[i].boss+"','phone':'"+data[i].phone+"','email':'"+data[i].email+"'}\" name='update' type='button' class='btn btn-outline-primary' data-bs-toggle='modal' data-bs-target='#myModal-update' style='box-shadow:none'>编辑</button>&nbsp;"+
                                "<button url='http://localhost:8080/web/dept/delete?id="+data[i].id+"' name='delete' type='button' class='btn btn-outline-danger' data-bs-toggle='modal' data-bs-target='#myModal-delete' style='box-shadow:none'>删除</button>"+
                                "</td>"+"</tr>"
                        }
                        newstyle+="</tbody>"
                        $('#table').append(newstyle)
                        $('#dept-id').val("")
                        $('#add-name').val("")
                        $('#add-people').val("")
                        $('#add-phone').val("")
                        $('#add-email').val("")
                    }
                    delet()
                    update()
                },"json"
            )
        }
    })
    //(确定)删除部门信息
    delet()
    function delet(){
        let deletes=document.getElementsByName("delete")
        let trs=document.getElementsByName("tr")
        for (let i = 0; i < deletes.length; i++) {
            deletes[i].onclick=function (){
                let url=$(deletes[i]).attr("url")
                document.getElementById('ok-delete').onclick=function (){
                    $.post(url,
                        function (){
                            $('#cancel-btn').click()
                            $(trs[i]).hide()
                        }
                    )
                }
            }
        }
    }
    //取消删除
    $('#cancel-delete').click(function (){
        $('#cancel-btn').click()
    })
    //查找部门信息
    $('#search').click(function (){
        let option=$('#select').find("option:selected").text()
        let request
        if($('#key').val()==""){
            request={key:"",method:""}
        }else if($('#key').val()!=""&&option=="负责人"){
            request={key:$('#key').val(),method:"负责人"}
        }else if($('#key').val()!=""&&option=="部门"){
            request={key:$('#key').val(),method:"部门"}
        }else if($('#key').val()!=""&&option=="编号"){
            request={key:$('#key').val(),method:"编号"}
        }
        $.post("${pageContext.request.contextPath}/dept/select",
            request,
            function (resp){
                if(resp==""){
                    $('#danger').show()
                    $('#danger').text("未查询到相关信息")
                    setTimeout(function (){
                        $('#danger').hide()
                    },2888)
                }else {
                    $('#table').empty()
                    let newstyle="<thead>"+
                        "<tr>"+
                        "<th style='width: 81px'>编号(ID)</th>"+
                        "<th style='width: 83px'>部门</th>"+
                        "<th style='width: 66px'>负责人</th>"+
                        "<th style='width: 94px'>电话</th>"+
                        "<th style='width: 232px'>邮箱</th>"+
                        "<th style='width: 141px'>操作</th>"+
                        "</tr>"+
                        "</thead>"+
                        "<tbody>"
                    for (let i = 0; i < resp.length; i++) {
                        newstyle+="<tr name='tr'>"+
                        "<input type='hidden' class='save_id' value='"+resp[i].id+"'>"+
                        "<td style='display:table-cell; vertical-align:middle'>"+resp[i].id+"</td>"+
                        "<td style='display:table-cell; vertical-align:middle'>"+resp[i].name+"</td>"+
                        "<td style='display:table-cell; vertical-align:middle'>"+resp[i].boss+"</td>"+
                        "<td style='display:table-cell; vertical-align:middle'>"+resp[i].phone+"</td>"+
                        "<td style='display:table-cell; vertical-align:middle'>"+resp[i].email+"</td>"+
                        "<td style='display:table-cell; vertical-align:middle'>"+
                        "<button url=\"{'id':'"+resp[i].id+"','name':'"+resp[i].name+"','boss':'"+resp[i].boss+"','phone':'"+resp[i].phone+"','email':'"+resp[i].email+"'}\" name='update' type='button' class='btn btn-outline-primary' data-bs-toggle='modal' data-bs-target='#myModal-update' style='box-shadow:none'>编辑</button>&nbsp;"+
                        "<button url='http://localhost:8080/web/dept/delete?id="+resp[i].id+"' name='delete' type='button' class='btn btn-outline-danger' data-bs-toggle='modal' data-bs-target='#myModal-delete' style='box-shadow:none'>删除</button>"+
                        "</td>"+
                        "</tr>"
                    }
                    newstyle+="</tbody>"
                    $('#table').append(newstyle)
                    update()
                    delet()
                }
            },"json"
        )
    })
    //修改部门信息
    update()
    function update(){
        let updates=document.getElementsByName("update")
        let trs=document.getElementsByName("tr")
        for (let i = 0; i < updates.length; i++) {
            updates[i].onclick=function (){
                function replaceAll(str, find, replace) {
                    return str.replace(new RegExp(find, 'g'), replace);
                }
                let str = replaceAll($(updates[i]).attr("url"),"\'", "\"");
                let json=JSON.parse(str)
                $('#id').val(json.id)
                $('#update-name').val(json.name)
                $('#title').text(json.name)
                $('#update-phone').val(json.phone)
                $('#update-email').val(json.email)
                $('#update-people').val(json.boss)
                document.getElementById('ok-update').onclick=function (){
                    if($('#id').val()==""||$('#update-name').val()==""||$('#update-people').val()==""||$('#update-phone').val()==""||$('#update-email').val()==""){
                        $('#warning').show()
                        $('#warning').text("请完善信息")
                        setTimeout(function (){
                            $('#warning').hide()
                        },2000)
                    }else if(checkPhone($('#update-phone').val())){
                        alert(checkPhone($('#update-phone').val()))
                        $('#warning').show()
                        $('#warning').text("电话号码非法(由7~8位数字组成)")
                        setTimeout(function (){
                            $('#warning').hide()
                        },2000)
                    }else if(checkEmail($('#update-email').val())){
                        $('#warning').show()
                        $('#warning').text("邮箱的格式非法")
                        setTimeout(function (){
                            $('#warning').hide()
                        },2000)
                    }else{
                        let childrens=$(trs[i]).children()
                        $(childrens[2]).text($('#update-name').val())
                        $(childrens[3]).text($('#update-people').val())
                        $(childrens[4]).text($('#update-phone').val())
                        $(childrens[5]).text($('#update-email').val())
                        $.post("${pageContext.request.contextPath}/dept/update",
                            {id:$('#id').val(),name:$('#update-name').val(),boss:$('#update-people').val(),phone:$('#update-phone').val(),email:$('#update-email').val()},
                            function (data){
                                if(data=="true"){
                                    //修改成功
                                    $('#myupdate-down').click()
                                    $(updates[i]).attr("url","{'id':'"+$('#id').val()+"','name':'"+$('#update-name').val()+"','boss':'"+$('#update-people').val()+"','phone':'"+$('#update-phone').val()+"','email':'"+$('#update-email').val()+"'}")
                                }else {
                                    $('#warning').show()
                                    $('#warning').text("系统中没有该职工")
                                    $(childrens[3]).text(json.boss)
                                    setTimeout(function (){
                                        $('#warning').hide()
                                    },2000)
                                }
                            }
                        )
                    }
                }
            }
        }
    }
    //职位管理
    $('#position').click(function (){
        getPositionName($('#title').text())
        getPositionTable($('#title').text())
    })
    //职位删除
    $('#position_delete_position').click(function (){
        $('#position_delete_modal').modal('show')
    })
    $('#position_ok_position').click(function (){
        //console.log($('#title').text())
        //console.log($('#position_select').val())
        $.post("http://localhost:8080/web/position/delete",
            {name:$('#position_select').val(),dept:$('#title').text()},
            function (resp){
                if(resp=='delete'){
                    $('#nb').click()
                    getPositionName($('#title').text())
                    getPositionTable($('#title').text())
                }
            }
        ),"json"
    })
    //职位添加
    $('#position_add_position').click(function (){
        if($('#position_name').val()==""){
            $('#danger').text('职位不能为空值')
            $("#danger").fadeToggle("slow")
            setTimeout(function (){
                $("#danger").fadeToggle("slow")
            },2000)
        }else{
            $.post("http://localhost:8080/web/position/add",
                {name:$('#position_name').val(),dept:$('#title').text()},
                function (resp){
                    if(resp=='add'){
                        getPositionName($('#title').text())
                        getPositionTable($('#title').text())
                        $('#position_name').val('')
                    }
                }
            )
        }
    })
    //职位下拉框
    function getPositionName(department){
        $.ajax({
            url:"http://localhost:8080/web/position/name",
            type:'get',
            async:false,
            data:{dept:department},
            dataType:'json',
            success:function (resp){
                $('#position_select').empty()
                let style="<option selected style='display: none'></option>"
                for (let i = 0; i < resp.length; i++) {
                    style+="<option>"+resp[i]+"</option>"
                }
                $('#position_select').append(style)
            }
        })
    }
    //职位表格
    function getPositionTable(department){
        $.ajax({
            url:"http://localhost:8080/web/position/name",
            type:'get',
            async:false,
            data:{dept:department},
            dataType:'json',
            success:function (resp){
                $('#position_table_name').empty()
                let style="<tbody><tr id='hover'><td rowspan='"+(resp.length+1)+"'style='cursor: default;vertical-align: middle;writing-mode:lr-tb;writing-mode:tb-rl;font-size: 22px'>职位</td></tr>"
                for (let i = 0; i < resp.length; i++) {
                    style+="<tr style='vertical-align: middle;cursor: default'><td>"+resp[i]+"</td></tr>"
                }
                style+="</tbody>"
                $('#position_table_name').append(style)
                $('#hover').removeClass('active')
            }
        })
    }
</script>
</html>
